<template>
  <a-card :bordered="false">
    <a-spin :spinning="confirmLoading">
      <j-form-container>
        <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
          <a-row>
            <a-col :span="12">
              <a-form-model-item
                :label="$t('抖音小程序AppID')"
                :labelCol="labelCol"
                :wrapperCol="wrapperCol"
                prop="tikTokAppId"
              >
                <a-input v-model="model.tikTokAppId" :placeholder="$t('请输入抖音小程序AppID')"></a-input>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="12">
              <a-form-model-item
                :label="$t('抖音小程序AppSecret')"
                :labelCol="labelCol"
                :wrapperCol="wrapperCol"
                prop="tikTokAppSecret"
              >
                <a-input v-model="model.tikTokAppSecret" :placeholder="$t('请输入抖音小程序AppSecret')"></a-input>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="12">
              <a-form-model-item
                :label="$t('抖音小程序支付SALT')"
                :labelCol="labelCol"
                :wrapperCol="wrapperCol"
                prop="tikTokSalt"
              >
                <a-input v-model="model.tikTokSalt" :placeholder="$t('请输入抖音小程序支付SALT')"></a-input>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="12">
              <a-row>
                <a-col :span="14" :offset="6">
                  <a-button type="primary" :disabled="confirmLoading" @click="submitForm" v-has="'BisSysParameterController:edit'">{{ $t('保存') }}</a-button>
                </a-col>
              </a-row>
            </a-col>
          </a-row>
        </a-form-model>
      </j-form-container>
    </a-spin>
    <yarn-cert-modal ref="yarnModal" @ok="conSubmit" @close="getInfo"></yarn-cert-modal>
  </a-card>
</template>
<script>
import axios from 'axios'
import { getAction, httpAction } from '@/api/manage'
import YarnCertModal from '@/views/setting/modules/YarnCertModal'

export default {
  name: 'TikTok',
  mixins: [],
  components: { YarnCertModal },
  data() {
    return {
      confirmLoading: false,
      model: {
        saltKey: '',
        tikTokSalt: '',
        secretKey: '',
        tikTokAppSecret: '',
        appidKey: '',
        tikTokAppId: '',
      },
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 14 },
      },
      validatorRules: {
        tikTokSalt: [{ required: true, message: '请输入抖音小程序支付SALT' }],
        tikTokAppSecret: [{ required: true, message: '请输入抖音小程序AppSecret' }],
        tikTokAppId: [{ required: true, message: '请输入抖音小程序AppID' }],
      },
      url: {
        list: '/bis/bisSysParameter/queryByName',
      },
    }
  },
  created() {
    this.getInfo()
  },
  methods: {
    getInfo() {
      axios.all([this.fun1(), this.fun2(), this.fun3()]).then(
        axios.spread((r1, r2, r3) => {
          if (r1.success) {
            this.model.saltKey = r1.result.id
            this.model.tikTokSalt = r1.result.svalue
          }
          if (r2.success) {
            this.model.secretKey = r2.result.id
            this.model.tikTokAppSecret = r2.result.svalue
          }
          if (r3.success) {
            this.model.appidKey = r3.result.id
            this.model.tikTokAppId = r3.result.svalue
          }
        })
      )
    },
    fun1() {
      return getAction('/bis/bisSysParameter/queryByName', { name: 'tikTokSalt' })
    },
    fun2() {
      return getAction('/bis/bisSysParameter/queryByName', { name: 'tikTokAppSecret' })
    },
    fun3() {
      return getAction('/bis/bisSysParameter/queryByName', { name: 'tikTokAppId' })
    },
    submitForm() {
      let that = this
      // 触发表单验证
      that.$refs.form.validate((valid) => {
        if (valid) {
          if (that.model.saltKey || that.model.secretKey || that.model.appidKey) {
            that.$refs.yarnModal.edit()
            return
          }
          that.conSubmit()
        }
      })
    },
    conSubmit() {
      let that = this
      that.confirmLoading = true
      let httpurl = '/bis/bisSysParameter/saveBatch'
      let method = 'post'
      let query = []
      query.push({
        id: that.model.saltKey ? that.model.saltKey : '',
        name: 'tikTokSalt',
        svalue: that.model.tikTokSalt,
        comment: '抖音支付SALT',
      })
      query.push({
        id: that.model.secretKey ? that.model.secretKey : '',
        name: 'tikTokAppSecret',
        svalue: that.model.tikTokAppSecret,
        comment: '抖音AppSecret',
      })
      query.push({
        id: that.model.appidKey ? that.model.appidKey : '',
        name: 'tikTokAppId',
        svalue: that.model.tikTokAppId,
        comment: '抖音AppID',
      })
      httpAction(httpurl, query, method)
        .then((res) => {
          if (res.success) {
            that.$message.success(res.message)
            that.getInfo()
          } else {
            that.$message.warning(res.message)
          }
        })
        .finally(() => {
          that.confirmLoading = false
        })
    },
  },
}
</script>